﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CreateFloor2.aspx.cs" Inherits="CreateFloor2" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="Styles.css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
     <asp:DropDownList ID="DropDownListRows" runat="server">
            <asp:ListItem Text="5"/>
            <asp:ListItem Text="6"/>
            <asp:ListItem Text="7"/>
            <asp:ListItem Text="8"/>
            <asp:ListItem Text="9"/>
            <asp:ListItem Text="10"/>
            <asp:ListItem Text="11"/>
            <asp:ListItem Text="12"/>
            <asp:ListItem Text="13"/>
            <asp:ListItem Text="14"/>
            <asp:ListItem Text="15"/>
            <asp:ListItem Text="16"/>
            <asp:ListItem Text="17"/>
            <asp:ListItem Text="18"/>
            <asp:ListItem Text="19"/>
            <asp:ListItem Text="20"/>
        </asp:DropDownList>
        <asp:DropDownList ID="DropDownListSeats" runat="server">
            <asp:ListItem Text="25"/>
            <asp:ListItem Text="26"/>
            <asp:ListItem Text="27"/>
            <asp:ListItem Text="28"/>
            <asp:ListItem Text="29"/>
            <asp:ListItem Text="30"/>
            <asp:ListItem Text="31"/>
            <asp:ListItem Text="32"/>
            <asp:ListItem Text="33"/>
            <asp:ListItem Text="34"/>
            <asp:ListItem Text="35"/>
            <asp:ListItem Text="36"/>
            <asp:ListItem Text="37"/>
            <asp:ListItem Text="38"/>
            <asp:ListItem Text="39"/>
            <asp:ListItem Text="40"/>
        </asp:DropDownList>
        <asp:Button runat="server" ID="btnCreateScreenDesigner" Text="Create Template" OnClick="SendInfo"/>
        <asp:Button ID="btnLayoutDone" runat="server" Text="Gem layout" OnClick="btnLayoutDone_Click" />
        <asp:Button ID="btnShowLayoutObj" runat="server" Text="Vis visualisering af seat-score i layout" />
        <div class="Floor" id="FloorDiv" runat="server"></div>
        <asp:HiddenField ID="json" runat="server" />
        <textarea id="json2" runat="server" style="width:100%;height: 50%">JSON HERE</textarea>
    </form>
    <div id="testDivs">Printing here...</div>
    <div id="Div1" onclick="calc()">Stats here...</div>
    <div id="Div2">Mouse track here</div>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        calc();
        
        function selectSeat(seatId) {
            var $seat = $("#" + seatId);

            $seat.removeClass('SeatDisabled');
            $seat.addClass('SeatAvailable');
        }

        function deselectSeat(seatId) {
            var $seat = $("#" + seatId);

            $seat.removeClass('SeatAvailable');
            $seat.addClass('SeatDisabled');
        }

        function selectOrDeselectSeat(seatId) {

            var $seat = $("#" + seatId);

            if ($seat.hasClass('SeatAvailable')) {
                //$seat.removeClass('SeatAvailable');
                //$seat.addClass('SeatDisabled');
                deselectSeat(seatId);
            } else {
                //$seat.removeClass('SeatDisabled');
                //$seat.addClass('SeatAvailable');
                selectSeat(seatId);
            }

            $('#testDivs').html($(this).attr('id'));
            calc();

            /* KODE TIL BOOKING SYSTEMET - KAN GENBRUGES!
            if ($seat.hasClass('SeatAvailable')) {
                $seat.removeClass('SeatAvailable');
                $seat.addClass('SeatPicked');
            } else if ($seat.hasClass('SeatBooked')) {
                alert("Allerede booked TODO");
            } else {
                $seat.removeClass('SeatPicked');
                $seat.addClass('SeatAvailable');
            }*/

            
        }

        $(".Seat").on("mousedown", function() {
            selectOrDeselectSeat($(this).attr('id'));
        });

        $(".Seat").on("mouseover", function (e) {
            //e.preventDefault();

            if ($mouseTrack.html()=="true") {//e.buttons == 1 || e.buttons == 3) {
                /*$(this).css({
                    backgroundColor: "red"
                });*/
                selectOrDeselectSeat($(this).attr('id'));
                //alert($(this).attr('id'));
            }
        });

        var $mouseTrack = $("#Div2");
        $mouseTrack.html("false");


        $(document).mousedown(function (e) {
            if ($(e.target).is("div")) {
                e.preventDefault();
            }

            // Left mouse button was pressed, set flag
            if (e.which === 1) $mouseTrack.html("true"); //leftButtonDown = true;
        });


        $(document).mouseup(function (e) {
            if ($(e.target).is("div")) {
                e.preventDefault();
            }
            // Left mouse button was released, clear flag
            if (e.which === 1) $mouseTrack.html("false"); //leftButtonDown = false;
        });

        function tweakMouseMoveEvent(e) {
            // Check from jQuery UI for IE versions < 9
            if ($.browser.msie && !(document.documentMode >= 9) && !event.button) {
                $mouseTrack.html("false"); //leftButtonDown = false;
            }

            // If left button is not set, set which to 0
            // This indicates no buttons pressed
            if (e.which === 1 && $mouseTrack.html()!="true") e.which = 0;
        }

        function calc() {

            var activeSeats = 0;
            var deactiveSeats = 0;
            var undefined = 0;
            var numCount = 0;

            var myJson = new Object();
            myJson.seats = [];

            $(".Seat").each(function () {
                var mySeat = new Object();

                mySeat.id = $(this).attr("id");



                if ($(this).hasClass("SeatAvailable")) {
                    activeSeats++;
                    mySeat.available = true;
                } else if ($(this).hasClass("SeatDisabled")) {
                    deactiveSeats++;
                    mySeat.available = false;
                } else {
                    undefined++;
                }

                numCount++;

                myJson.seats.push(mySeat);
            });

            $("#Div1").html("Active: " + activeSeats + "<br>" +
                "Deactive: " + deactiveSeats + "<br>" +
                "Undefined: " + undefined + "<br>" +
                "In all: " + numCount + "<br>");

            $("#json").val(JSON.stringify(myJson));
            //$("#json2").val($("#json").val());
        }

    </script>
</body>
</html>
